<!-- eslint-disable vue/valid-v-for -->
<template lang="">
  <div>
    <div class="div1">
      <div class="div2">
        <div class="bidding_details">
          <div class="bidding_details_one">
            <div v-if="biddingNotLoggedIn" style="height: 300px;">
              <div style="width: 597.25px;height: 300px;float: left;">
                <el-carousel trigger="click">
                  <el-carousel-item v-for="item in goodsData.imgId==null?[]:this.goodsData.imgId.split(',')">
                    <el-image style="height: 260px;width: 517.25px;margin-top: 20px;margin-left: 40px;" :src="'http://101.43.223.224:8765/image/getImageById?id='+item"></el-image>
                  </el-carousel-item>
                </el-carousel>
              </div>
              <div style="width: 400px;height: 400px;float: left;">
                <div style="height: 150px;width: 800px;">
                  <div style="height: 150px;width: 550px;float: left;">
                    <div style="font-size: 20px;">{{goodsData.goodsName}}</div>
                    <div style="margin-bottom: 30px;margin-top: 30px;">
                      <span style="margin-right: 10px;">起拍价</span>
                      <span style="color: red;font-size: 24px;">¥{{goodsData.startPrice}}</span>
                    </div>
                    <div>
                      <span style="margin-right: 10px;">距开始</span>
                      <span style="color: red;">
                        <CountDown1
                        v-on:start_callback="countDownS_cb(1)"
                        v-on:end_callback="countDownE_cb(1)"
                        :currentTime="timeFnNew()"
                        :startTime="timeFnNew()"
                        :endTime="timeFn(goodsData.startTime)"
                        :dayTxt="'天'"
                        :hourTxt="'小时'"
                        :minutesTxt="'分钟'"
                        :secondsTxt="'秒'" style="display: inline-block;">
                      </CountDown1>
                      </span>
                    </div>
                  </div>
                  <div>
                </div>
                <div style="height: 150px;width: 400px;">
                  <div style="width: 250px;height: 150px;float: left;line-height: 150px; margin-top: -37px;">
                    <el-button style="width: 250px;height: 60px;font-size: 18px;color: #fff;background-color: #FF6633;" @click="toEarnseMoneyPage()">报名交保证金</el-button>
                  </div>
                  <div style="width: 550px;height: 150px;float: left; margin-top: -30px;">
                    <div style="margin-top: 18px;margin-left:10px;">
                      <img  style="width: 30px;height: 30px;margin-top: 10px;margin-right: 10px;"
                      src="https://img.axureshop.com/5f/7a/2f/5f7a2fd7263e4e95897c8cd096b23108/images/1_0%E7%AB%9E%E4%B9%B0%E8%AF%A6%E6%83%85%EF%BC%88%E6%9C%AA%E7%99%BB%E9%99%86%EF%BC%89/u1618.png">
                      <span style="position: relative;top: -8px;color: #0096FF;">报名必看</span>
                    </div>
                    <div style="margin-left:10px;">
                      <img style="width: 30px;height: 30px;margin-top: 10px;margin-right: 10px;margin-left: 2px;"
                      src="https://img.axureshop.com/5f/7a/2f/5f7a2fd7263e4e95897c8cd096b23108/images/1_0%E7%AB%9E%E4%B9%B0%E8%AF%A6%E6%83%85%EF%BC%88%E6%9C%AA%E7%99%BB%E9%99%86%EF%BC%89/u1619.png">
                      <span style="position: relative;top: -11px;">
                        提醒:先报名缴保证金再出价。如果您已经交付保证金,请先
                        <span style="color: #0096FF;">登录</span>
                      </span>
                    </div>
                    </div>
                </div>
              </div>
              </div>

            <div v-if="biddingIsAboutToStartNotLoggedIn" style="height: 300px;">
              <div style="width: 597.25px;height: 300px;float: left;">
                <div class="block">
                  <!-- 图片合集 -->
                  <el-carousel trigger="click">
                    <el-carousel-item v-for="item in goodsData.imgId.split(',')" :key="item">
                      <h3 class="small">
                        <el-image style="height: 260px;width: 517.25px;margin-top: 20px;margin-left: 40px;" :src="'http://101.43.223.224:8765/image/getImageById?id='+item"></el-image>
                      </h3>
                    </el-carousel-item>
                  </el-carousel>
                </div>
              </div>
              <div style="width: 800px;height: 300px;float: left;">
                <div style="height: 150px;width: 800px;">
                  <div style="height: 150px;width: 550px;float: left;">
                    <p style="font-size: 20px;">{{goodsData.goodsName}}</p>
                    <p>
                      <span style="margin-right: 10px;">起拍价</span>
                      <span style="color: red;font-size: 18px;">￥{{goodsData.startPrice}}</span>
                    </p>
                    <p>
                      <span style="margin-right: 10px;">距开始</span>
                      <span style="color: red;">
                        <CountDown1
                        v-on:start_callback="countDownS_cb(1)"
                        v-on:end_callback="countDownE_cb(1)"
                        :currentTime="timeFnNew()"
                        :startTime="timeFnNew()"
                        :endTime="timeFn(goodsData.endTime)"
                        :dayTxt="'天'"
                        :hourTxt="'小时'"
                        :minutesTxt="'分钟'"
                        :secondsTxt="'秒'" style="display: inline-block;">
                      </CountDown1></span>
                    </p>
                  </div>
                </div>
                <div style="height: 150px;width: 800px;">
                  <div style="width: 70px;background-color: #FF6633;height:70px;float: left;margin-top: 40px;">
                    <div style="position: relative;top: 14px;left:20px;color: #fff;">即将</div>
                    <div style="position: relative;top: 14px;left:20px;color: #fff;">开始</div>
                  </div>
                  <div style="width: 730px;height: 70px;background-color: #F2F2F2;float: left;line-height: 70px;font-size: 18px;margin-top: 40px;">
                    <span style="margin-left: 10px;">竞买即将开始,已停止缴纳保证金，期待您下次参与!</span>
                  </div>
                </div>
              </div>
            </div>
            <div v-if="bidding" style="height: 300px;">
              <div style="width: 597.25px;height: 300px;float: left;">
                <div class="block">
                  <!-- 图片合集 -->
                  <el-carousel trigger="click">
                    <el-carousel-item v-for="item in goodsData.imgId.split(',')" :key="item">
                      <h3 class="small">
                        <el-image style="height: 260px;width: 517.25px;margin-top: 20px;margin-left: 40px;" :src="'http://101.43.223.224:8765/image/getImageById?id='+item"></el-image>
                      </h3>
                    </el-carousel-item>
                  </el-carousel>
                </div>
              </div>
              <div style="width: 800px;height: 300px;float: left;">
                <div style="height: 150px;width: 800px;">
                  <div style="height: 150px;width: 550px;float: left;">
                    <p style="font-size: 20px;">{{goodsData.goodsName}}</p>
                    <p>
                      <span style="margin-right: 10px;">当前价</span>
                      <span style="color: red;font-size: 18px;">¥{{goodsData.startPrice}}</span>
                      <span style="color: #FF6633;font-size: 14px;margin-left: 50px;position: relative; top: -2px;">竞买人：{{loginUser.name}}</span>
                    </p>
                    <p>
                      <span style="margin-right: 10px;">距结束</span>
                      <span style="color: red;">
                        <CountDown1
                        v-on:start_callback="countDownS_cb(1)"
                        v-on:end_callback="countDownE_cb(1)"
                        :currentTime="timeFnNew()"
                        :startTime="timeFnNew()"
                        :endTime="timeFn(goodsData.endTime)"
                        :dayTxt="'天'"
                        :hourTxt="'小时'"
                        :minutesTxt="'分钟'"
                        :secondsTxt="'秒'" style="display: inline-block;">
                      </CountDown1></span>
                    </p>
                  </div>
                </div>
                <div style="height: 150px;width: 800px;">
                  <div style="width: 70px;background-color: #FF6633;height:70px;float: left;margin-top: 40px;line-height: 70px;text-align: center;color: #fff;">
                    <!-- <div style="position: relative;top: 14px;left:20px;color: #fff;">竞买中</div> -->
                    <!-- <div style="position: relative;top: 14px;left:20px;color: #fff;"></div> -->
                    竞买中
                  </div>
                  <div style="width: 730px;height: 70px;background-color: #F2F2F2;float: left;line-height: 70px;font-size: 18px;margin-top: 40px;">
                    <span style="margin-left: 10px;">本次竞买已经开始，已停止缴纳保证金，期待您的下次参与!</span>
                  </div>
                </div>
              </div>
            </div>
            <div v-if="biddingForYiJie" style="height: 300px;">
              <div style="width: 597.25px;height: 300px;float: left;">
                <div class="block">
                  <!-- 图片合集 -->
                  <el-carousel trigger="click">
                    <el-carousel-item v-for="item in goodsData.imgId.split(',')" :key="item">
                      <h3 class="small">
                        <el-image style="height: 260px;width: 517.25px;margin-top: 20px;margin-left: 40px;" :src="'http://101.43.223.224:8765/image/getImageById?id='+item"></el-image>
                      </h3>
                    </el-carousel-item>
                  </el-carousel>
                </div>
              </div>
              <div style="width: 800px;height: 300px;float: left;">
                <div style="height: 150px;width: 800px;">
                  <div style="height: 150px;width: 550px;float: left;">
                    <p style="font-size: 20px;">{{goodsData.goodsName}}</p>
                    <p>
                      <span style="margin-right: 10px;">成交价</span>
                      <span style="color: red;font-size: 18px;">¥{{goodsData.startPrice}}</span>
                      <span style="color: #FF6633;font-size: 14px;margin-left: 50px;position: relative; top: -2px;">竞买人：{{loginUser.userName}}</span>
                    </p>
                    <p>
                      <span style="margin-right: 10px;">结束时间</span>
                      <span>{{goodsData.endTime}}</span>
                    </p>
                  </div>
                </div>
                <div style="height: 150px;width: 800px;">
                  <div style="width: 70px;background-color: #CCCCCC;height:70px;float: left;margin-top: 40px;line-height: 70px;text-align: center;color: #fff;">
                    <!-- <div style="position: relative;top: 14px;left:20px;color: #fff;">竞买中</div> -->
                    <!-- <div style="position: relative;top: 14px;left:20px;color: #fff;"></div> -->
                    已结束
                  </div>
                  <div style="width: 730px;height: 70px;background-color: #F2F2F2;float: left;line-height: 70px;font-size: 18px;margin-top: 40px;">
                    <span style="margin-left: 10px;">本次竞买已结束，期待您的下次参与!</span>
                  </div>
                </div>
              </div>
            </div>
              <div style="width: 100%; height: 300px;float: left; margin-top: 10px;margin-left: 330px;">
                <div style="width: 100%;height: 50px;">
                  <img style="width: 30px;height:30px;margin-top: 10px;float: left;"
                  src="https://img.axureshop.com/5f/7a/2f/5f7a2fd7263e4e95897c8cd096b23108/images/1_0%E7%AB%9E%E4%B9%B0%E8%AF%A6%E6%83%85%EF%BC%88%E6%9C%AA%E7%99%BB%E9%99%86%EF%BC%89/u1622.png">
                  <div style="float: left;font-size: 18px;margin-left: 15px;margin-top: 13px;">竞拍规则</div>
                  <div style="float: left;margin-top: 16px;margin-left: 95px;">
                    <span style="margin-right: 10px;">14</span>次围观
                  </div>
                  <div style="float: left;margin-top: 16px;margin-left: 159px;">
                    <span style="margin-right: 10px;">5</span>人设置提醒
                  </div>
                  <div style="float: left;margin-top: 16px;margin-left: 98px;">
                    <span style="margin-right: 10px;">{{buyerCount}}</span>人报名
                  </div>
                </div>
                <div style="width: 800px;height: 125px; float: left;margin-left: 10px;">
                  <div style="width: 399px;height: 125px;float: left;">
                    <div style="width: 399px;height:41px;">
                      <div style="width: 199px;float: left;">起拍价：¥{{goodsData.startPrice}}</div>
                      <div style="width: 200px;float: left;">保证金：{{goodsData.earnestMoney}}元</div>
                    </div>
                    <div style="width: 399px;height:41px;">
                      <div style="width: 199px;float: left;">重量：{{goodsData.weight}}</div>
                      <div style="width: 200px;float: left;">数量：{{goodsData.number}}</div>
                    </div>
                    <div style="width: 399px;height:42px;">
                      <div style="width: 199px;float: left;" v-if="goodsData.transactionType === 1">交货方式：自提</div>
                      <div style="width: 199px;float: left;" v-if="goodsData.transactionType === 2">交货方式：邮寄</div>
                      <div style="width: 200px;float: left;">交货地点：{{goodsData.transactionAddress}}</div>
                    </div>
                  </div>
                  <div style="width: 399px;height: 125px;float: left;">
                    <div style="width: 399px;height: 125px;float: left;">
                      <div style="width: 399px;height:41px;margin-left: 40px;">
                        <div style="width: 199px;float: left;">加价幅度：1000元</div>
                        <div style="width: 200px;float: left;">保留价：有</div>
                      </div>
                      <div style="width: 399px;height:41px;margin-left: 40px;">
                        <div style="width: 199px;float: left;">竞买时长：{{timeLag(goodsData.startTime,goodsData.endTime)}} 分钟</div>
                        <div style="width: 200px;float: left;">延时：{{goodsData.delayMinutes}}分钟</div>
                      </div>
                      <div style="width: 399px;height:42px;margin-left: 40px;">
                        <div style="width: 199px;float: left;">佣金比例：0.5%</div>
                        <div style="width: 200px;float: left;">会员免佣金</div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div v-if="biddingHasNotStartedAndHasBeenLoggedIn" style="width: 100%;">
              <div style="width: 48%;height: 300px;float: left;">
                <div class="block">
                  <!-- 图片合集 -->
                  <el-carousel trigger="click">
                    <el-carousel-item v-for="item in goodsData.imgId==null?[]:this.goodsData.imgId.split(',')" :key="item">
                      <h3 class="small">
                        <el-image style="height: 260px;width: 517.25px;margin-top: 20px;margin-left: 40px;" :src="'http://101.43.223.224:8765/image/getImageById?id='+item"></el-image>
                      </h3>
                    </el-carousel-item>
                  </el-carousel>
                </div>
              </div>
              <div style="float: right;width: 50%;">
                <div style="height: 150px;">
                  <div style="height: 130px;float: left;margin-top: 20px;">
                    <p style="font-size: 20px;margin-bottom: 18px;">{{goodsData.goodsName}}</p>
                    <p style="margin-bottom: 18px;">
                      <span style="margin-right: 10px;">起拍价</span>
                      <span style="color: red;font-size: 18px;">¥{{goodsData.startPrice}}</span>
                    </p>
                    <p v-if="goodsData.transactionStatus === 1">
                      <span style="margin-right: 10px;">距开始</span>
                      <span style="color: red;">
                        <CountDown1
                        v-on:start_callback="countDownS_cb(1)"
                        v-on:end_callback="countDownE_cb(1)"
                        :currentTime="timeFnNew()"
                        :startTime="timeFnNew()"
                        :endTime="timeFn(goodsData.startTime)"
                        :dayTxt="'天'"
                        :hourTxt="'小时'"
                        :minutesTxt="'分钟'"
                        :secondsTxt="'秒'" style="display: inline-block;">
                      </CountDown1>
                      </span>
                    </p>
                  </div>
                </div>
                <div style="height: 150px;">
                  <div style="width: 70px;background-color: #FF6633;height:70px;float: left;">
                    <div style="position: relative;top: 14px;left:20px;color: #fff;">即将</div>
                    <div style="position: relative;top: 14px;left:20px;color: #fff;">开始</div>
                  </div>
                  <div style="width: 430px;height: 70px;background-color: #F2F2F2;float: left;line-height: 70px;font-size: 18px;">
                    <span style="margin-left: 10px;">您已具备竞买资格，请耐心等待!</span>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div v-if="notStarted" class="bidding_details_two">
            <p style="text-align: center;">出价记录(34)</p>
            <div style="margin-left: 40px;margin-right:40px;">
              <p style="text-align: center;">
                <span style="float: left;">状态</span>
                <span>竞买人</span>
                <span style="float: right;">价格</span>
              </p>
              <div style="width: 348.11px;height: 410px;">
                <span style="color: #66A4D7;">>></span>
                <span style="color: #66A4D7;">即将开始暂无出价记录</span>
              </div>
            </div>
          </div>
          <div v-if="started" class="bidding_details_two">
            <p style="text-align: center;">出价记录(34)</p>
            <div >
              <p style="text-align: center;">
                <span style="float: left;width: 33%;">状态</span>
                <span style="width: 33%;">竞买人</span>
                <span style="float: right;width: 34%;">价格</span>
              </p>
              <div style="width: 100%;height: 410px;">
                <p style="text-align: center;">
                  <span style="float: left;width: 33%;color: red;">领先</span>
                  <span style="width: 33%;color: red;">某某某</span>
                  <span style="float: right;width: 34%;color: red;">27,890</span>
                </p>
                <p style="text-align: center;">
                  <span style="float: left;width: 33%;">出局</span>
                  <span style="width: 33%;">熊大</span>
                  <span style="float: right;width: 34%;">26,890</span>
                </p>
                <p style="text-align: center;">
                  <span style="float: left;width: 33%;">出局</span>
                  <span style="width: 33%;">熊二</span>
                  <span style="float: right;width: 34%;">25,890</span>
                </p>
                <p style="text-align: center;">
                  <span style="float: left;width: 33%;">出局</span>
                  <span style="width: 33%;">光头强</span>
                  <span style="float: right;width: 34%;">24,890</span>
                </p>
                <p style="text-align: center;margin-top: 50px;">>>出价记录</p>
              </div>
            </div>
          </div>

        </div>
        <div style="width: 100%;height: 70px;float: left;background-color: #fff;">
          <div style="width: 10%;height: 70px;line-height: 70px;text-align: center;font-size: 20px;float: left;font-weight: bold;">
            竞拍流程：
          </div>
          <div style="float:left;height:50px;float: left;margin-top: 10px;"></div>
          <div style="width: 89.9%;height: 70px;float: left;line-height: 70px;">
            <span style="margin-left: 50px;font-size: 20px;">01<span style="margin-left: 10px;">现场看货</span></span>
            <span style="margin-left: 50px;">></span>
            <span style="margin-left: 50px;font-size: 20px;">02<span style="margin-left: 10px;">交保证金</span></span>
            <span style="margin-left: 50px;">></span>
            <span style="margin-left: 50px;font-size: 20px;">03<span style="margin-left: 10px;">出价竞拍</span></span>
            <span style="margin-left: 50px;">></span>
            <span style="margin-left: 50px;font-size: 20px;">04<span style="margin-left: 10px;">竞拍成功</span></span>
            <span style="margin-left: 50px;">></span>
            <span style="margin-left: 50px;font-size: 20px;">05<span style="margin-left: 10px;">支付货款</span></span>
            <span style="margin-left: 50px;">></span>
            <span style="margin-left: 50px;font-size: 20px;">06<span style="margin-left: 10px;">到货确认</span></span>
          </div>
        </div>
        <div style="width: 100%;text-align: center;float: left;margin-top: 20px;">
          <el-image style="width: 900px; height: 700px; margin-top: 20px;" v-for="item in goodsData.imgViewId.split(',')" :src="'http://101.43.223.224:8765/image/getImageById?id='+item" :key="item"></el-image>
        </div>
        <el-row>
          <el-col :span="8"><div>
              <div style="width: 40%;height: 200px;margin-left: 10%;float: left;">
                <img style="float: left;margin-top: 37px;" src="https://img.axureshop.com/5f/7a/2f/5f7a2fd7263e4e95897c8cd096b23108/images/%E9%A6%96%E9%A1%B5/u561.svg">
                <div style="float: left;margin-left: 10px;font-size: 18px;margin-top: 50px;">微信服务号</div>
                <span style="float: left;margin-left: 10px;margin-top:30px;font-size: 14px;">一手消息随时掌握</span>
              </div>
            </div></el-col>
          <el-col :span="8"><div>
            <div style="width: 40%;height: 200px;float: left;margin-left: 10%;">
              <img style="float: left;margin-top: 37px;" src="https://img.axureshop.com/5f/7a/2f/5f7a2fd7263e4e95897c8cd096b23108/images/%E9%A6%96%E9%A1%B5/u564.svg">
              <div style="float: left;margin-left: 10px;font-size: 18px;margin-top: 50px;">微信小程序</div>
              <span style="margin-left: -87px;margin-top: 100px;float: left;font-size: 14px;">随时随地交易</span>
            </div>
          </div></el-col>
          <el-col :span="8"><div>
            <p style="margin-top: 47px;">
              <span style="margin-right: 50px;font-size: 14px;">沪ICP备XXXXXXXX号</span>
              <span style="margin-right: 50px;font-size: 14px;">增值电信业务经营许可证沪B</span>
              <span style="font-size: 14px;">全国免费服务热线：400-886-0000</span>
            </p>
            <p style="margin-top: 30px;">
              <span style="margin-right: 50px;font-size: 14px;">沪ICP备XXXXXXXX号</span>
              <span style="font-size: 14px;">增值电信业务经营许可证沪B</span>
            </p>
          </div></el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>
<script>
import CountDown1 from 'vue2-countdown'
export default {
  components: {
    CountDown1
  },
  data () {
    return {
      token: window.sessionStorage.getItem('token'), // 取token
      goodsId: this.$route.query.goodsId, // 当前竞拍商品id
      goodsData: {}, // 当前竞拍商品id
      biddingNotLoggedIn: false, // 竞买未登录(未交保证金)
      biddingIsAboutToStartNotLoggedIn: false, // 竞买即将开始未登录
      biddingHasNotStartedAndHasBeenLoggedIn: false, // 竞买未开始已登录（已交保证金）
      bidding: false, // 竞拍中
      biddingForYiJie: false, // 竞买已结束
      notStarted: true, // 未开始竞拍的记录
      started: false, // 已开始竞拍的记录
      loginUser: {}, // 当前登录用户
      goodsEarnestMoney: {}, // 当前用户与该商品的关系
      buyerCount: 0 // 参与拍卖的人数
    }
  },
  methods: {
    // 跳转至交保证金页面
    toEarnseMoneyPage () {
      this.$router.push({
        path: '/earnestMoneyPage',
        query: { goodsId: this.goodsId }
      })
    },
    // 查询当前商品id
    async getGoodsById () {
      await this.$axios.get('/client/auction/getGoodsById', {
        params: {
          goodsId: this.goodsId
        }
      }).then(res => {
        if (res.data.flag) {
          this.goodsData = res.data.obj
          this.getLoginUser()
          console.log('this.goodsData')
          console.log(this.goodsData)
        } else {
          this.myMessage('商品加载失败', 'error')
        }
      })
    },
    // 查询当前登录用户信息
    async getLoginUser () {
      await this.$axios.post('/clientuser/getLoginUser', this.token).then(res => {
        if (res.data.flag) {
          this.loginUser = res.data.obj
          console.log(this.loginUser)
        } else {
          // this.myMessage('当前用户暂未参与交易', 'error')
          console.log('当前用户暂未参与交易')
        }
      })
      console.log('已获取登录用户信息')
    },
    // 查询当前竞品报名人数
    async getGoodsEarnestMoneyCount () {
      this.$axios.get('/client/auction/getGoodsEarnestMoneyCount',
        {
          params: {
            goodsId: this.goodsData.id
          }
        }).then(res => {
        if (res.data.flag) {
          this.buyerCount = res.data.obj
          console.log(this.listData)
        } else {
          console.log('当前用户暂未参与交易')
        }
      })
    },
    // 查询用户交保障金状态
    async getGoodsEarnestMoneyByUserId () {
      await this.$axios.get('/client/auction/getGoodsEarnestMoneyByUserId',
        {
          params: {
            userId: this.loginUser.id,
            goodsId: this.goodsId
          }
        }).then(res => {
        if (res.data.flag) {
          this.goodsEarnestMoney = res.data.obj
          console.log(this.goodsEarnestMoney)
        } else {
          console.log('当前用户暂未参与交易')
        }
      })
    },
    async setShowStatus () { // 根据用户，商品设置当前页面显示的状态
      // 判断当前用户是否为空
      console.log(JSON.stringify(this.loginUser))
      if (JSON.stringify(this.loginUser) !== '{}') { // 不为空，表示用户已登录
        // 判断当前商品竞拍状态
        if (this.goodsData.transactionStatus === 1) { // 状态码为1，即将开始
          // 判断是否叫保证金
          if (JSON.stringify(this.goodsEarnestMoney) === '{}' || this.goodsEarnestMoney.earnestMoneyStatus === 0) { // 未交保证金
            this.biddingNotLoggedIn = true
          }
          if (this.goodsEarnestMoney.earnestMoneyStatus === 1) {
            // this.biddingNotLoggedIn = true

            this.biddingHasNotStartedAndHasBeenLoggedIn = true
            console.log(this.biddingHasNotStartedAndHasBeenLoggedIn)
          }
        } else if (this.goodsData.transactionStatus === 2) { // 状态码为2，进行中
          this.$router.push({
            path: '/bidView',
            query: { goodsId: this.goodsId }
          })
          // this.started = true
          // this.notStarted = false
          // this.bidding = true
        } else { // 状态码为3，已结束
          this.biddingForYiJie = true
        }
      } else { // 为空，暂未登录
        // 判断当前商品竞拍状态
        if (this.goodsData.transactionStatus === 1) { // 状态码为1，即将开始
          this.biddingNotLoggedIn = true
        } else if (this.goodsData.transactionStatus === 2) { // 状态码为2，进行中
          this.$router.push({
            path: '/bidView',
            query: { goodsId: this.goodsId }
          })
          // this.bidding = true
        } else { // 状态码为3，已结束
          this.biddingForYiJie = true
        }
      }
    },
    // 时间格式
    timeFn (date) {
      const dateBegin = new Date(date.replace(/-/g, '/'))// 将-转化为/，使用new Date
      const time = parseInt(dateBegin.getTime() / 1000)
      return time
    },
    // 当前时间格式
    timeFnNew () {
      const time = parseInt((new Date()).getTime() / 1000)
      return time
    },
    timeLag (startTime, endTime) {
      let time = new Date()
      if (startTime > endTime) {
        time = new Date(startTime) - new Date(endTime)
      } else if (startTime < endTime) {
        time = new Date(endTime) - new Date(startTime)
      }
      return Math.floor(time / (60 * 1000))
    },
    countDownS_cb: function (x) { // 开始倒计时进行的回调
      // console.log(x, '开始')
    },
    countDownE_cb: function (x) { // 倒计时结束进行的回调
      this.jjs = false
      this.jjs1 = true
      this.lgan = false
      this.lganyy = false
      this.ygan = true
      this.saveBidRecord() // 保存出价历史记录
      this.saveEndOfAuctionInfo() // 保存拍卖结束的信息形成订单
      this.zgjr = JSON.parse(JSON.stringify(this.items[0])).loginName
      this.zgj = JSON.parse(JSON.stringify(this.items[0])).maxBid
      // this.myMessage('success', '恭喜' + bidder + '获得以最高价获得此次竞品')
      this.dialogVisible1 = true
    },
    // 我的信息
    myMessage (message, type) {
      this.$message({
        message: message,
        type: type
      })
    }
  },
  async mounted () {
    console.log(this.goodsData)
    await this.getGoodsById()
    await this.getLoginUser()
    await this.getGoodsEarnestMoneyByUserId()
    await this.setShowStatus()
  }
}
</script>
<style lang="less" scoped>
   .div1{
    width: 100%;
    height: 100%;
    margin: 0 auto;
  }
  .div2{
    width: 80%;
    height: 100%;
    margin: 0 auto;
  }
  .bidding_details_two{
    /* margin-left: 17px; */
    width: 24%;
    height: 300px;
    float: left;
  }
  .bidding_details_one{
    width: 75%;
    height: 300px;
    float: left;
  }
  .bidding_details{
    margin-top: 10px;
    width: 100%;
    height: 300px;
    background-color: #fff;
  }
  .QR_code_two{
    float: left;
    width: 50%;
    height: 200px;
  }
  .QR_code_one{
    float: left;
    width: 50%;
    height: 200px;
  }
  .QR_code{
    margin-top: 20px;
    float: left;
    width: 100%;
    height: 240px;
  }
</style>
